
export default getEmailTemplate = function(user, url, options) {
  let title = `你好${user.username}！${options.title || ""}`;
  let linkName = options.linkName || "";
  let subtitle = options.subtitle || "";
  let content = `
    <div class="class-layouts-content-card">
      <p style="margin-top:0px;margin-bottom:32px;">${title}</p>
      <a href="${url}" class="class-layouts-content-card-link">${linkName}</a>
      <p style="margin-top:0px;margin-bottom:0px;">${subtitle}</p>
    </div>
  `;
  return getHtml(content);
};

let getHtml = function(content) {
  return `
    <!doctype html>
    <html lang="zh">

    <head>
      <meta charset="utf-8">
      <title>Class卡司群聊</title>
    </head>

    <body>
      <div style="height:auto;width:100%;max-width:100%;min-height:100%;">
        <style>
          .class-layouts {
            height: auto;
            width: 100%;
            max-width: 100%;
            min-height: 100%;
            color: #212529;
            font-size: 16px;
            display: flex;
          }
          .class-layouts-box {
            flex: 1;
            padding: 20px;
            background: #eeeeee;
          }
          .class-layouts-content-card {
            margin: auto;
            padding: 40px;
            width: 450px;
            background: #ffffff;
            border-radius: 6px;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
          }
          @media (max-width: 768px) {
            .class-layouts-content-card {
              width: 100%;
            }
          }
          .class-layouts-content-card-link {
            display: block;
            text-decoration: none !important;
            padding: 8px 16px;
            margin-bottom: 32px;
            font-size: 20px;
            font-weight: bold;
            text-align: center;
            color: rgb(3, 169, 244);
            border-radius: 6px;
            background: rgba(3, 169, 244, .2);
          }
        </style>
        <div class="class-layouts">
          <div class="class-layouts-box">
            ${content}
          </div>
        </div>
      </div>
    </body>

    </html>
  `;
};
